<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head th:fragment="head(title)">
  <meta charset="UTF-8">
  <!-- 移动端界面设置-->
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <title th:replace="${title}">首页</title>

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
  <link rel="stylesheet" type="text/css" href="../static/css/custom.css" th:href="@{/css/custom.css}">
  <link rel="stylesheet" type="text/css" href="../static/css/calendar.css" th:href="@{/css/calendar.css}">
</head>
<body>

<!--导航-->
<nav th:fragment="menu(n)" class="ui inverted attached segment c-padded-tb-mini c-nav-shadow">

  <div class="ui inverted secondary stackable menu">

    <h2 class="ui red  header item">Blog</h2>
    <a href="#" class="j-item item c-mobile-hide" th:classappend="${n==1} ? 'active'"><i class="home icon"></i>首页</a>
    <a href="#" class="j-item item c-mobile-hide" th:classappend="${n==2} ? 'active'"><i class="server icon"></i>分类</a>
    <a href="#" class="j-item item c-mobile-hide" th:classappend="${n==3} ? 'active'"><i class="tags icon"></i>标签</a>
    <a href="#" class="j-item item c-mobile-hide" th:classappend="${n==4} ? 'active'"><i class="clone icon"></i>归档</a>
    <a href="#" class="j-item item c-mobile-hide" th:classappend="${n==5} ? 'active'"><i class="clipboard outline icon"></i>更多</a>
    <div class="right j-item item c-mobile-hide">
      <div class="ui icon input">
        <input class="prompt" type="text" placeholder="搜索...">
        <i class="search link icon" ></i>
      </div>
    </div>
    <a href="#" class="ui menu toggle black button c-top-right c-mobile-show">
      <i class="sidebar icon"></i>
    </a>
  </div>

</nav>

<!--footer-->
<footer th:fragment="footer" class="ui inverted attached segment">
  <div class="c-footer-text" >
    <h5>此博客网站仅供个人使用</h5>
    <span id="runTime"></span>

  </div>

</footer>

</body>
</html>